<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8" />
    <meta content="IE=edge" http-equiv="X-UA-Compatible" />
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport" />
    <title>loading</title>
    <link href="assets/stylesheets/bootstrap.min.css" rel = "stylesheet" />
    <style type="text/css">
      body { background: #f7f7f7; }
      .container { padding-left:0px;padding-right:0px;}
      .row, .col-xs-12 { width:100%; padding-left:0px; padding-right:0px;margin-left:0px; margin-right:0px;}
      #loading img { width: 100%; background: transparent; }
      #text a, #text { color: #e0e0e0; font-size:12px;}
    </style>
  </head>
  <body>
    <div class="container">
      <div class="row"  id="loading">
        <div class="col-xs-12">
          <img src="assets/images/loading.gif" />
        </div>
      </div>
    </div> 

    <script type="text/javascript">
      (function(){
        window.Mobile = {
          isIOS: function() {
            return navigator.userAgent.match(/iPhone|iPad/i);
          },
          isAndroid: function() {
            return navigator.userAgent.match(/Android/i);
          }
        }
        window.Loading = {
          connectWebViewJavascriptBridge: function(callback) {
            if(window.WebViewJavascriptBridge) {
              callback(WebViewJavascriptBridge)
            }
            else {
              document.addEventListener('WebViewJavascriptBridgeReady', function() {
                callback(WebViewJavascriptBridge)
              }, false)
            }
          },
          refresh: function() {
            if(Mobile.isIOS()) {
              Loading.connectWebViewJavascriptBridge(function(bridge){
                bridge.callHandler('refreshBrowser', {}, function(response) {
                });
              })
            }
            else if(Mobile.isAndroid()) {
              window.AndroidJSBridge.refreshBrowser();
            }
            else {
              alert("未知浏览器:" + navigator.userAgent);
            }
          }
        }
      }).call(this);

      window.onload = function() {
        var w = window;
        var d = document;
        var e = d.documentElement;
        var g = d.getElementsByTagName("body")[0];
        var x =  e.clientHeight || g.clientHeight;
        var loading = document.getElementById("loading");
        var bottom = (x-loading.clientHeight)/2;

        loading.style.position = "absolute";
        loading.style.bottom = bottom + "px";
      };
    </script>
  </body>
</html>